<template>
  <!-- 卡位管理  我的卡位 -->
  <div class="app-container" v-loading="loading">
    <el-form :model="queryParams" ref="queryForm" :inline="true" class="search-form-new" label-width="80px">
      <el-form-item label="店铺" prop="tenantId" v-hasPermi="['searchTenantID']">
        <el-select v-model="queryParams.tenantId" placeholder="请选择店铺" clearable filterable>
          <el-option v-for="dict in tenantList" :key="dict.tenantId" :label="dict.tenantName" :value="dict.tenantId" />
        </el-select>
      </el-form-item>
      <el-form-item label="手机号" prop="tel">
        <el-input v-model="queryParams.tel" placeholder="请输入手机号" clearable  />
      </el-form-item>
      <el-form-item label="卡位编号" prop="num">
        <el-input v-model="queryParams.num" placeholder="请输入编号" clearable  />
      </el-form-item>
      <el-form-item label="ICCID" prop="iccid">
        <el-input v-model="queryParams.iccid" placeholder="请输入手机卡ICCID" clearable  />
      </el-form-item>
      <el-form-item label="保管人" prop="custodian">
        <el-input v-model="queryParams.custodian" placeholder="请输入保管人" clearable  />
      </el-form-item>
      <el-form-item label="卡位类型" prop="deviceType">
        <el-select v-model="queryParams.deviceType" placeholder="请选择卡位类型" clearable>
          <el-option v-for="(dict,key) in commonMaps.telDeviceType" :key="dict.id" :label="dict.label" :value="key" />
        </el-select>
      </el-form-item>
      <el-form-item label="设备类型" prop="typecode">
        <el-select v-model="queryParams.typecode" placeholder="请选择设备类型" clearable>
          <el-option v-for="(item,i) in SIMdeviceType" :key="i" :label="item.dictLabel" :value="item.dictValue" />
        </el-select>
      </el-form-item>
      <el-form-item label="设备状态" prop="deviceStatus">
        <el-select v-model="queryParams.deviceStatus" placeholder="请选择设备状态" clearable>
          <el-option label="在线" :value="1" />
          <el-option label="离线" :value="2" />
        </el-select>
      </el-form-item>
      <el-form-item label="核对状态" label-width="80px" prop="heduiState">
        <el-select clearable v-model="queryParams.heduiState" placeholder="请选择">
          <el-option v-for="(dict, key) in commonMaps.kaweiHeduiTypeMap" :key="key" :label="dict.label" :value="key" />
        </el-select>
      </el-form-item>
      <el-form-item label="创建时间" prop="">
        <el-date-picker clearable v-model="timer" value-format="yyyy-MM-dd" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item class="btns">
        <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
        <el-button type="warning" icon="el-icon-refresh" @click="resetQuery">重置</el-button>
        <el-button type="success" icon="el-icon-plus" @click="openAdd" v-hasPermi="['phoneManage:add']">新增</el-button>
        <el-button type="warning" plain icon="el-icon-upload" @click="piliangdaoru" v-hasPermi="['phoneManage:piliang']">批量导入</el-button>

        <el-button type="success" icon="el-icon-plus" @click="openShare">分享</el-button>
        <el-button type="primary" plain icon="el-icon-setting" @click="openLengQue" v-hasPermi="['phoneManage:lengqueshezhi']">手机号冷却设置</el-button>

        <el-button type="primary" plain icon="el-icon-setting" @click="openShareSet">共享设置</el-button>
        <el-button type="primary" plain icon="el-icon-plus" @click="openAddShare">添加共享</el-button>
        <span class="link" style="margin-left: 15px;">
          <a target="_blank" href="https://www.yuque.com/yuduhulian/ilv88x/yw8qnpwg38v4afd7?singleDoc#%20%E3%80%8A%E5%8D%A1%E4%BD%8D%E7%AE%A1%E5%AE%B6%EF%BC%9A%E5%8A%9F%E8%83%BD%E8%AF%B4%E6%98%8E%E4%B8%8E%E4%BB%8B%E7%BB%8D%E3%80%8B">使用教程</a>
        </span>
      </el-form-item>

    </el-form>
    <div class="table_box table_box_new">
      <el-table :data="tableData.records" height="calc(100vh - 315px)" border stripe>
        <el-table-column prop="num" label="卡位编号/IMEI" width="150"></el-table-column>
        <el-table-column prop="iccid" label="ICCID" width="180"></el-table-column>
        <el-table-column prop="num" label="卡位类型" width="120">
          <template slot-scope="scope">
            <el-tag :type="commonMaps.telDeviceType[scope.row.deviceType||1].type">{{commonMaps.telDeviceType[scope.row.deviceType||1].label}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="typecode" label="设备类型" width="120">
          <template slot-scope="scope">
            <el-tag v-if="SIMdeviceType[scope.row.typecode]" :type="SIMdeviceType[scope.row.typecode].cssClass||''">{{ SIMdeviceType[scope.row.typecode].dictLabel }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="创建时间" width="160"></el-table-column>
        <el-table-column prop="tel" label="手机号" width="120"></el-table-column>
        <el-table-column prop="tel" label="核对状态" width="80">
          <template slot-scope="scope">
            <span style="cursor: pointer;" @click="openHeduiJilu(scope.row.id)">
              <el-tag :type="commonMaps.kaweiHeduiTypeMap[scope.row.heduiState||0].type">{{ commonMaps.kaweiHeduiTypeMap[scope.row.heduiState||0].label }}</el-tag>
            </span>
          </template>
        </el-table-column>
        <el-table-column prop="custodian" label="保管人" width="120"></el-table-column>
        <!-- carrierStatus: 1未出租 2未共享 3已共享 -->
        <el-table-column prop="" label="腾讯" width="120">
          <template slot-scope="scope">
            <div class="yibangding" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[1]">
              <template v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[1].carrierStatus==1">
                <div class="link" @click="tanchuangceng(getCarrierTypeToObj(scope.row.carrierTypeVoList)[1].content, getCarrierTypeToObj(scope.row.carrierTypeVoList)[1].name)">
                  已绑定: {{getCarrierTypeToObj(scope.row.carrierTypeVoList)[1].count}}
                </div>
                <div class="tag">
                  {{ getEndTime(getCarrierTypeToObj(scope.row.carrierTypeVoList)[1]) }}
                </div>
                <div style="color: #666;">
                  {{ `180天绑定${scope.row.daysCot||0}次` }}
                </div>
              </template>
              <template v-else>
                <el-tag type="warning" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[1].carrierStatus==2">未共享</el-tag>
                <el-tag type="danger" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[1].carrierStatus==3">已共享</el-tag>
              </template>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="" label="网易" width="120">
          <template slot-scope="scope">
            <div class="yibangding" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[2]">
              <template v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[2].carrierStatus==1">
                <div class="link" @click="tanchuangceng(getCarrierTypeToObj(scope.row.carrierTypeVoList)[2].content, getCarrierTypeToObj(scope.row.carrierTypeVoList)[2].name)">
                  已绑定: {{getCarrierTypeToObj(scope.row.carrierTypeVoList)[2].count}}
                </div>
                <div class="tag">
                  {{ getEndTime(getCarrierTypeToObj(scope.row.carrierTypeVoList)[2]) }}
                </div>
              </template>
              <template v-else>
                <el-tag type="warning" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[2].carrierStatus==2">未共享</el-tag>
                <el-tag type="danger" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[2].carrierStatus==3">已共享</el-tag>
              </template>

            </div>
          </template>
        </el-table-column>
        <el-table-column prop="" label="米哈游" width="120">
          <template slot-scope="scope">
            <div class="yibangding" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[3]">
              <template v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[3].carrierStatus==1">
                <div class="link" @click="tanchuangceng(getCarrierTypeToObj(scope.row.carrierTypeVoList)[3].content, getCarrierTypeToObj(scope.row.carrierTypeVoList)[3].name)">
                  已绑定: {{getCarrierTypeToObj(scope.row.carrierTypeVoList)[3].count}}
                </div>
                <div class="tag">
                  {{ getEndTime(getCarrierTypeToObj(scope.row.carrierTypeVoList)[3]) }}
                </div>
              </template>
              <template v-else>
                <el-tag type="warning" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[3].carrierStatus==2">未共享</el-tag>
                <el-tag type="danger" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[3].carrierStatus==3">已共享</el-tag>
              </template>
            </div>
          </template>
        </el-table-column>

        <el-table-column prop="" label="steam" width="120">
          <template slot-scope="scope">
            <div class="yibangding" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[5]">
              <template v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[5].carrierStatus==1">
                <div class="link" @click="tanchuangceng(getCarrierTypeToObj(scope.row.carrierTypeVoList)[5].content, getCarrierTypeToObj(scope.row.carrierTypeVoList)[5].name)">
                  已绑定: {{getCarrierTypeToObj(scope.row.carrierTypeVoList)[5].count}}
                </div>
                <div class="tag">
                  {{ getEndTime(getCarrierTypeToObj(scope.row.carrierTypeVoList)[5]) }}
                </div>
              </template>
              <template v-else>
                <el-tag type="warning" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[5].carrierStatus==2">未共享</el-tag>
                <el-tag type="danger" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[5].carrierStatus==3">已共享</el-tag>
              </template>
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="" label="其他" width="120">
          <template slot-scope="scope">
            <div class="yibangding" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[4]">
              <template slot-scope="scope">
                <div class="yibangding" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[4]">
                  <template v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[4].carrierStatus==1">
                    <div class="link" @click="tanchuangceng(getCarrierTypeToObj(scope.row.carrierTypeVoList)[4].content, getCarrierTypeToObj(scope.row.carrierTypeVoList)[5].name)">
                      已绑定: {{getCarrierTypeToObj(scope.row.carrierTypeVoList)[4].count}}
                    </div>
                    <div class="tag">
                      {{ getEndTime(getCarrierTypeToObj(scope.row.carrierTypeVoList)[4]) }}
                    </div>
                  </template>
                  <template v-else>
                    <el-tag type="warning" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[4].carrierStatus==2">未共享</el-tag>
                    <el-tag type="danger" v-if="getCarrierTypeToObj(scope.row.carrierTypeVoList)[4].carrierStatus==3">已共享</el-tag>
                  </template>
                </div>
              </template>

            </div>
          </template>
        </el-table-column>

        <!-- <el-table-column prop="gameStr" label="绑定游戏" min-width="300">
          <template slot-scope="scope">
            <div class="bangding-box " v-if="scope.row.carrierTypeVoList">
              <template v-for="item in scope.row.carrierTypeVoList">
                <div class="bditem" v-if="item.content&&item.content.length" :key="item.id" @click="tanchuangceng(item.content, item.name)">

                  <div>{{item.name}}</div>
                  <div>{{item.count}}</div>
                  <div>剩余冷却3天</div>
                </div>
              </template>

            </div>
            <div v-else>暂无</div>
          </template>
        </el-table-column> -->
        <el-table-column prop="remark" label="备注" min-width="100" show-overflow-tooltip></el-table-column>
        <el-table-column prop="remark" label="状态" width="100">
          <template slot-scope="scope">
            <el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0" @change="statusChange($event, scope.row)">
            </el-switch>
          </template>
        </el-table-column>
        <el-table-column prop="remark" label="设备状态" width="100">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.deviceStatus==1" type="success">在线</el-tag>
            <el-tag v-if="scope.row.deviceStatus==2" type="danger">离线</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="yue" label="话费余额" width="100">
          <template slot-scope="scope">
            <span v-if="scope.row.yue<10" style="color:red;font-size:18px;font-weight:blod">{{scope.row.yue}}</span>
            <span v-else>{{scope.row.yue}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="telType" label="运营商"></el-table-column>
        <el-table-column fixed="right" label="操作" width="230">
          <template slot-scope="scope">
            <el-button type="edit" @click="editRow(scope.row)" v-hasPermi="['phoneManage:edit']">编辑</el-button>
            
            <el-button v-if="scope.row.deviceType==2&&checkPermi(['phoneManage:fasongduanxin'])" type="text" @click="sendSms(scope.row)">发送短信</el-button>

            <!-- <el-button type="text" @click="viewRecords(scope.row)" v-hasPermi="['phoneManage:bangdingrecord']">绑定记录</el-button>
            <el-button type="del" @click="delRow(scope.row)" v-hasPermi="['phoneManage:del']">删除</el-button>
            <el-button type="del"  @click="hedui(scope.row)" v-hasPermi="['phoneManage:hedui']">核对</el-button> -->
            <!-- v-if="scope.row.deviceType==2" -->
            <!-- <el-button type="edit" @click="fenxiang(scope.row)" v-if="scope.row.deviceType==2" v-hasPermi="['phoneManage:share']">短信分享</el-button> -->
            <el-dropdown trigger="click" @command="clickMore($event,scope.row)">
              <el-button type="warning" plain size="mini">
                更多操作<i class="el-icon-arrow-down el-icon--right"></i>
              </el-button>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item v-hasPermi="['phoneManage:bangdingrecord']" command="1">绑定记录</el-dropdown-item>
                <el-dropdown-item v-hasPermi="['phoneManage:hedui']" command="2">核对</el-dropdown-item>
                <el-dropdown-item v-hasPermi="['phoneManage:del']" command="3">删除</el-dropdown-item>
                <el-dropdown-item v-if="scope.row.typecode=='STT307CC3'&&scope.row.deviceType==2" command="4">亮灯</el-dropdown-item>
                <el-dropdown-item v-if="scope.row.typecode=='STT307CC3'&&scope.row.deviceType==2" command="5">灭灯</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
      <pagination v-show="tableData.total > 0" :total="tableData.total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
    </div>

    <addDialog ref="addDialog"></addDialog>
    <!-- 系列弹窗 -->
    <el-dialog class="diologs" append-to-body :title="names" :visible.sync="dialogVisiblese" width="800px">
      <div style="min-height: 300px;">
        <el-tabs v-model="activeName">
          <el-tab-pane v-for="(item, index) in xilie" :key="index" :label="item.name+'('+item.list.length+')'" :name="''+index">
            <div class="twos" style="color: #1abc9c">
              {{ '绑定的账号' }}
            </div>
            <div class="twos" v-for="(item1, index1) in item.list" :key="index1">
              {{ item1 }}
            </div>
          </el-tab-pane>
        </el-tabs>
      </div>
    </el-dialog>
    <!-- 绑定记录弹窗 -->
    <viewRecordsDialog ref="viewRecordsDialog"></viewRecordsDialog>
    <!-- 发送短信弹窗 -->
    <sendSmsDialog ref="sendSmsDialog"></sendSmsDialog>
    <!-- 创就按分享链接 -->
    <addFenxiangDialog ref="addFenxiangDialog"></addFenxiangDialog>
    <!--批量 导入弹出 -->
    <el-dialog title="批量导入" :visible.sync="showInportVisible" width="430px" append-to-body>
      <div v-loading="isUploading" element-loading-text="正在处理中，可能时间较长，请耐心等待...">
        <div style="margin-bottom:15px">
          <div style="color:red;margin-bottom:10px">提示：批量导入的卡位均为【一般卡位】。</div>
        </div>
        <el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="importheaders" :action="importUrl" :disabled="isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag style="margin-bottom:15px">
          <i class="el-icon-upload"></i>
          <div class="el-upload__text">
            将文件拖到此处，或
            <em>点击上传</em>
          </div>
          <div class="el-upload__tip text-center" slot="tip">
            <span>仅允许导入xls、xlsx格式文件。</span>
            <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="downloadModel">下载模板</el-link>
          </div>
        </el-upload>
        <div slot="footer" class="dialog-footer">
          <el-button @click="showInportVisible = false">取 消</el-button>
          <el-button type="primary" @click="submitFileForm" :loading="isUploading">确 定</el-button>
        </div>
      </div>
    </el-dialog>
    <!-- 创就按分享链接 -->
    <addFenxiangPiliang ref="addFenxiangPiliang"></addFenxiangPiliang>

    <!-- 冷却设置弹窗 -->
    <lengQueSet ref="lengQueSet"></lengQueSet>
    <!-- 核对状态弹窗 -->
    <heDuiZhuangTai ref="heDuiZhuangTai"></heDuiZhuangTai>
    <!-- 核对记录 -->
    <heDuiJiLu ref="heDuiJiLu"></heDuiJiLu>
    <!-- 共享设置 -->
    <shareSet ref="shareSet"></shareSet>
    <!-- 添加共享 -->
    <addGongxiang ref="addGongxiang"></addGongxiang>
  </div>
</template>

<script>
import addDialog from "./components/add";
import sendSmsDialog from "./components/sendSmsDialog";
import viewRecordsDialog from "./components/viewRecords";
import phoneApi from "@/api/phoneManage";
import { getToken } from "@/utils/auth";
import tabBar from "../../components/tabBar.vue";
import addFenxiangDialog from "./components/addFenxiang";
import addFenxiangPiliang from "./components/addFenxiangPiliang.vue";

import lengQueSet from "./components/lengQueSet.vue";
import heDuiZhuangTai from "./components/heDuiZhuangTai.vue";
import { getTenantPushSettingsByTenantId } from "@/api/system/shopManage";
import heDuiJiLu from "./components/heDuiJiLu.vue";
import shareSet from "./gongxiang/shareSet.vue";
import addGongxiang from "./gongxiang/addGongxiang.vue";
export default {
  name: "Wodekawei",
  components: {
    addDialog,
    tabBar,
    viewRecordsDialog,
    sendSmsDialog,
    addFenxiangDialog,
    addFenxiangPiliang,
    lengQueSet,
    heDuiZhuangTai,
    heDuiJiLu,
    shareSet,
    addGongxiang,
  },
  data() {
    return {
      timer:[],
      activeName: "0",
      names: "",
      xilie: [],
      dialogVisiblese: false,
      tableData: {
        records: [],
        total: 0,
      },
      loading: false,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        deviceType: "",
        iccid:'',
        num:'',
        tenantId:'',
        tel:'',
        custodian:'',
        deviceStatus:'',
        heduiState:'',
        createTimeStart:'',
        createTimeEnd:'',
        typecode:''
      },
      importUrl: "",
      isUploading: "",
      showInportVisible: false,
      importheaders: {
        Authorization: "Bearer " + getToken(),
        timeout: 1000 * 60 * 10,
      },
      lengQueObj: {},
      SIMdeviceType:{}
    };
  },
  created() {
    // this.getGames();
    // this.getHost();
    
    this.getList();
    this.getData()
    this.getLengQue();
  },
  activated() {},
  computed: {
    tenantList() {
      return this.$store.getters.tenantList;
    },
    shopInfo() {
      return this.$store.getters.shopInfo;
    },
    // // 计算当前列的数据
    getCarrierTypeToObj() {
      return (val) => {
        if (val && val.length) {
          return this.arrayToObject(val, "id");
        } else {
          return [];
        }
      };
    },
    // 计算冷却期剩余
    getEndTime() {
      return (val) => {
        if (!this.lengQueObj[val.id]) {
          return "";
        }
        if (!val.maxCreateTime) {
          return "";
        }
        let result = "";
        const now = new Date();
        const start = new Date(val.maxCreateTime);
        if (start) {
          const days = Number(this.lengQueObj[val.id]);
          if (days > 0) {
            // 计算时间差（毫秒）
            const timeDiff = now.getTime() - start.getTime();
            if (timeDiff > 0) {
              // 将毫秒转换为天数（1天 = 24 * 60 * 60 * 1000毫秒）
              const daysDiff = Math.floor(timeDiff / (1000 * 60 * 60 * 24));
              const shengyu = days - daysDiff;
              if (shengyu > 0) {
                result = `冷却剩余${shengyu}天`;
              }
              // if (shengyu > 0 && shengyu <=1) {
              //   result = `即将结束冷却`;
              // }
            }
          }
        }
        return result;
      };
    },
  },
  methods: {
    // 获取智能设备类型
    getData(){
      this.getDicts('SIMdeviceType').then(r=>{
        if(r.data&&r.data.length){
          this.SIMdeviceType = this.arrayToObject(r.data,'dictValue')
        }
      })
    },
    // 打开核对弹窗
    hedui(row) {
      this.$refs.heDuiZhuangTai.open(row);
    },
    // 打开核对记录
    openHeduiJilu(id) {
      if (this.checkPermi(["phoneManage:heduijilu"])) {
        this.$refs.heDuiJiLu.open(id);
      }
    },
    // 打开共享设置
    openShareSet() {
      this.$refs.shareSet.open();
    },
    // 添加共享
    openAddShare() {
      this.$refs.addGongxiang.open();
    },
    // 创建批量分享
    openShare() {
      this.$refs.addFenxiangPiliang.open([], "wode");
    },
    // 获取手机号冷却时间
    getLengQue() {
      if(this.shopInfo){
        getTenantPushSettingsByTenantId({
          tenantId:this.shopInfo.tenantId,
          type: 6, //6 手机号冷却设置
        }).then((res) => {
          if (res.data && res.data.settingsJson) {
            this.lengQueObj = JSON.parse(res.data.settingsJson);
          }
        });
      }
      
    },
    // 冷却时间设置
    openLengQue() {
      this.$refs.lengQueSet.open("phone");
    },
    //系列弹层
    tanchuangceng(row, i) {
      //console.log(111);
      if (row.length == 0) {
        this.dialogVisiblese = false;
        this.$message({
          message: "暂未绑定！",
          type: "warning",
        });
        return;
      }
      this.dialogVisiblese = true;
      //console.log(row);
      this.xilie = row;
      this.names = i;
      // this.listOne = row[0].list;
      // this.nameyouxi = row[0].name;
    },
    // 获取列表
    getList() {
      this.loading = true;
      if (this.timer && this.timer.length) {
        this.queryParams.createTimeStart = this.timer[0];
        this.queryParams.createTimeEnd = this.timer[1] + " " + "23:59:59";
      } else {
        this.queryParams.createTimeStart = "";
        this.queryParams.createTimeEnd = "";
      }
      phoneApi.getList(this.queryParams).then((response) => {
        this.tableData.records = response.rows;
        this.tableData.total = response.total;
        this.loading = false;
        if (response.rows && response.rows.length) {
          this.rise = response.rows[0].rise;
        }
      });
    },
    // 搜索
    search() {
      this.queryParams.pageNum = 1;
      this.queryParams.pageSize = 10;
      this.getList();
    },
    // 创建分享
    fenxiang(row) {
      this.$refs.addFenxiangDialog.open(row, "mine");
    },
    // 状态改变
    statusChange(e, row) {
      phoneApi.editPhone(row).then((res) => {
        //console.log("%c Line:194 🌰 res", "color:#3f7cff", res);
        this.getList();
      });
    },
    // 点击批量导入按钮
    piliangdaoru() {
      this.importUrl =
        process.env.VUE_APP_BASE_API + "/account/tel/manage/importData";
      this.isUploading = false;
      this.showInportVisible = true;
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit();
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.showInportVisible = false;
      this.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert(response.msg, "导入结果", { dangerouslyUseHTMLString: true });
      this.getList();
    },
    // 导出模版
    downloadModel() {
      this.isUploading = true;
      phoneApi
        .exportModel()
        .then((res) => {
          this.isUploading = false;
          this.$download.downloadFile(res, "卡位导入模板");
        })
        .catch((err) => {
          this.isUploading = false;
        });
    },
    // 打开新增弹窗
    openAdd() {
      this.$refs.addDialog.open();
    },
    // 打开编辑弹窗
    editRow(row) {
      this.$refs.addDialog.open("edit", row);
    },

    // 点击更多操作
    clickMore(e,row){
      if(e==1){
        // 绑定记录
        this.viewRecords(row)
      }else if(e==2){
        // 核对
        this.hedui(row)
      }else if(e==3){
        // 删除
        this.delRow(row)
      }else if(e==4){
        // 亮灯
        this.liangdeng(row,2)
      }else if(e==5){
        // 灭灯
        this.liangdeng(row,1)
      }

    },
    liangdeng(row,type){
      const obj = {
        id:row.id,
        type:type
      }
      phoneApi.switchLight(obj).then(res=>{
        if(res.code==200){
          this.$message.success(res.msg)
        }
      })

    },
    // 查看换绑记录
    viewRecords(row) {
      this.$refs.viewRecordsDialog.open(row.tel);
    },
    // 发送短信
    sendSms(row) {
      if(row.tel&&row.tel.length==11){
        this.$refs.sendSmsDialog.open(row, "mine");
      }else{
        this.$message.error('当前卡位没有手机号，无法操作！')
      }
      
    },
    // 删除
    delRow(row) {
      this.$confirm("此操作将永久删除该记录, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          phoneApi.delPhone(row.id).then((res) => {
            this.$message({
              type: "success",
              message: "删除成功!",
            });
            this.getList();
          });
        })
        .catch((err) => {});
    },

    //重置
    resetQuery() {
      // this.queryParams = {
      //   pageNum: 1,
      //   pageSize: 10,
      // };
      this.resetForm('queryForm')
      this.timer = [];
      this.getList();
    },
  },
};
</script>
<style lang="scss" scoped>
.ones {
  width: 166px;
  height: 42px;
  text-align: center;
  line-height: 42px;
  border: 1px solid #ccc;
}

.two {
  text-align: center;
  width: 300px;
}

.twos {
  width: 100%;
  padding: 11px 20px;
  border: 1px solid #f2f2f2;
}
.bangding-box {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  font-size: 12px;
  .bditem {
    margin-right: 20px;
    width: 100px;
    cursor: pointer;
    color: $primary;
    &:last-child {
      margin-right: 0;
    }
  }
}

.yibangding {
  .red {
    color: red;
  }
  .tag {
    background-color: #f49600;
    font-size: 12px;
    line-height: 22px;
    border-radius: 11px;
    color: #fff;
  }
}
</style>